﻿@model IEnumerable<Century.Models.Common.SystemConfiguration>
@{
    ViewBag.Title = "Index";
}
<br />
<h2>Config Manager</h2>
<br />
@(Html.Telerik().Grid<Century.Models.Common.SystemConfiguration>()
    .Name("Grid")
    .DataKeys(keys => keys.Add(c => c.Id))
        .ToolBar(commands =>
        {
            commands.Insert().ButtonType(GridButtonType.ImageAndText).ImageHtmlAttributes(new { style = "margin-left:0" });
            commands.Custom().Name("ReloadConfig").ButtonType(GridButtonType.ImageAndText).ImageHtmlAttributes(new { style = "margin-left:0" }).Text("Reload Config").Ajax(true).Action("Reload", "ConfManager");
        })
    .Columns(columns =>
    {
        columns.Bound(o => o.Id);
        columns.Bound(o => o.Owner);
        columns.Bound(o => o.ConfigKey);
        columns.Bound(o => o.ConfigValue).Width(300);
        columns.Bound(o => o.ConfigCode);
        columns.Bound(o => o.Description);
        columns.Bound(o => o.IsEncrypt);
        columns.Bound(o => o.ValueType);
        columns.Bound(o => o.ListSeparator);

        columns.Command(command =>
        {
            command.Edit().ButtonType(GridButtonType.Image);

        }).Width(50);
    })

    .DetailView(details => details.ClientTemplate(
            Html.Telerik().Grid<Century.Models.Common.SystemConfigurationProperty>()
                .DataKeys(keys => keys.Add(c => c.Id))
                    .Name("SystemConfigurationProperties_<#= Id #>")
                .Columns(columns =>
                {
                    columns.Bound(o => o.Id);
                    columns.Bound(o => o.PropertyKey);
                    columns.Bound(o => o.PropertyValue);
                    columns.Command(command =>
                    {
                        command.Edit().ButtonType(GridButtonType.ImageAndText);

                    }).Width(150);
                })
                .DataBinding(dataBinding => dataBinding.Ajax()
                    .Select("DetailsForConfig", "ConfManager", new { configId = "<#= Id #>" })
                         .Update("EditDetailsForConfig", "ConfManager", new { configId = "<#= Id #>" }))
                .Pageable()
                .Sortable()
                .Filterable()
                .Editable(editing => editing.Mode(GridEditMode.PopUp))
                .ToHtmlString()
                
    ))
         .ClientEvents(clientEvents =>
         {
             clientEvents.OnEdit("editClick");
         }
            )
       .DataBinding(dataBinding => dataBinding.Ajax()
                         .Select("GetSystemConfigurationList", "ConfManager")
                         .Update("EditSystemConfiguration", "ConfManager")
                         .Insert("InsertSystemConfiguration", "ConfManager")

        )
       .Groupable()
       .Filterable()
       .Editable(editing => editing.Mode(GridEditMode.PopUp))
       .Sortable()
       .Pageable(pagingSetting => pagingSetting.PageSize(20))
       .Resizable(config =>
        {
            config.Columns(true);
        })
        .Reorderable(config =>
        {
            config.Columns(true);
        })
        .ColumnContextMenu()
         .ClientEvents(events => events.OnComplete("Grid_onCommand"))
       )
<script type="text/javascript">
    function Grid_onCommand(e) {
        if (e.name == 'ReloadConfig') {
            alert('Config Reloaded')
        }
    }

    function editClick(e) {
        $(e.form).closest(".t-window-content").width(700).height(500);
        var popup = $("#" + e.currentTarget.id + "PopUp");
        popup.css({ "left": ($(window).width() / 2 - $(popup).width() / 2) + "px", "top": ($(window).height() / 2 - $(popup).height() / 2) + "px" });
    }
</script>
<style type="text/css">
.editor-field .text-box
{
    width:590px;
}
</style>
